<template>
  <div class="div_width">
    <el-row style="padding-top: 20px">
      <div style="float: left; height: 35px">
        <i class="el-icon-bangzhu"></i>
      </div>
      <div style="margin-top: 3px;height: 35px;">
        <h4><b>销售目标</b></h4>
      </div>
    </el-row>
    <div>
      <span style="font-size: 12px;margin-left:5px;margin-right: 10px;">日期:</span>
      <el-select size="medium" v-model="date" @change="changeDate()" style="width: 110px;" placeholder="请选择">
        <el-option
          v-for="item in options"
          :key="item.label"
          :value="item.label">
        </el-option>
      </el-select>
      <span @click="dateAim" style="font-size: 12px;cursor: pointer;margin-left: 80px">设置个人目标</span>
      <span style="margin-left: 5px;margin-right: 5px">|</span>
      <span @click="dateAir" style="font-size: 12px;cursor: pointer">查看未完成目标</span>
    </div>
    <el-dialog title="设置目标" :visible.sync="dialogFormVisible" width="70%">
      <hr class="border-t-a"/>
      <el-form label-width="80px" style="margin-top: 40px">
        <el-row>
          <el-col :span="16">
            <el-form-item label="员工">
                <el-cascader v-model="employeesId" :options="empList" style="width: 710px"
                             :props="{value:'employeesId',children:'children', label: 'empName',expandTrigger: 'hover' }"
                             @change="empChange" :show-all-levels="false"></el-cascader>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <div class="count_money">
              <div class="border_site">
                <el-select size="medium" v-model="year" @change="changeYear()" style="width: 80px" placeholder="请选择">
                  <el-option
                    v-for="item in option"
                    :key="item.label"
                    :value="item.label">
                  </el-option>
                </el-select>
                <span>年度业务目标是￥</span>
                <el-input onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" v-model="total" style="width: 100px"></el-input>
                <span>元</span>
                <el-button type="primary" @click="countAvg" :disabled="disabledFn" style="margin-left:85px;margin-bottom: 20px">平均分配到月</el-button>
              </div>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="6">
            <div class="first_quarter">
              <div style="padding-top: 10px;margin-left: 66px;margin-bottom: 10px">第一季度</div>
              <hr class="border-t-b"/>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>一月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="january" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>二月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="february" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled2" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>三月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="march" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled3" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="first_quarter">
              <div style="padding-top: 10px;margin-left: 66px;margin-bottom: 10px">第二季度</div>
              <hr class="border-t-b"/>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>四月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="april" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled4" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>五月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="may" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled5" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>六月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="june" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled6" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
            </div>
          </el-col>
          <el-col :span=6>
            <div class="first_quarter">
              <div style="padding-top: 10px;margin-left: 66px;margin-bottom: 10px">第三季度</div>
              <hr class="border-t-b"/>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>七月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="july" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled7" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>八月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="august" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled8" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>九月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="september" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled9" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="first_quarter">
              <div style="padding-top: 10px;margin-left: 66px;margin-bottom: 10px">第四季度</div>
              <hr class="border-t-b"/>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>十月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="october" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled10" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>十一月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="november" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled11" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
              <el-row style="margin-top: 10px;margin-bottom: 10px">
                <el-col :span="8" :push="1" style="margin-top: 7px">
                  <span>十二月份</span>
                </el-col>
                <el-col :span="15">
                  <el-input v-model="december" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')" :disabled="disabled12" @blur="changeSum()" size="small"></el-input>
                </el-col>
              </el-row>
            </div>
          </el-col>
        </el-row>
        <el-row style="margin-top: 20px;margin-bottom: -10px">
          <el-col :span="6" :push="18">
            <el-button type="primary" @click="addTarget">确定</el-button>
            <el-button @click="dialogFormVisible = false">取消</el-button>
          </el-col>
        </el-row>
      </el-form>
    </el-dialog>
    <el-drawer
      :visible.sync="dialogFormVisibleTwo"
      :with-header="false"
      size="45%">
      <el-row style="margin-bottom: 10px;margin-top: 10px">
        <el-col :span="2" :push="5">
          <el-date-picker
            v-model="time"
            type="month"
            style="width: 170px"
            value-format="yyyy-MM-dd"
            @change="changeTime()"
            placeholder="请选择日期">
          </el-date-picker>
        </el-col>
        <el-col :span="8" :push="12">
          <el-input placeholder="员工姓名" @change="searchPage()"
                    v-model="empName" suffix-icon="el-icon-search">
          </el-input>
        </el-col>
      </el-row>
      <div style="height: 520px">
        <el-scrollbar style="height: 100%">
          <el-table :data="tableData" style="width: 100%">
            <el-table-column align="left" prop="goalId" type="selection"></el-table-column>
            <el-table-column align="left" prop="deptByDeptsId.deptName" label="部门"></el-table-column>
            <el-table-column align="left" prop="empByEmployeesId.empName" label="部门人员"></el-table-column>
            <el-table-column align="left" width="200" prop="goalValue" label="目标值">
              <template slot-scope="s">
                ￥<el-input v-model="s.row.goalValue" size="mini" style="width: 80px"></el-input>
              </template>
            </el-table-column>
            <el-table-column align="left" prop="goalDate" label="目标日期">
              <template slot-scope="c">
                {{c.row.goalDate | formatDate}}
              </template>
            </el-table-column>
            <el-table-column align="left" width="60" label="操作">
              <template slot-scope="r">
                <i class="el-icon-edit" title="修改" style="font-size:17px;cursor:pointer"
                   @click="update(r.row.goalId,r.row.goalValue)"></i>
              </template>
            </el-table-column>
          </el-table>
          <div class="limit">
            <el-pagination
              :current-page.sync="currPage"
              :page-sizes="[5, 10, 15, 20]"
              :page-size="pageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="totalSize"
              @current-change="changePage"
              @size-change="sizeChange">
            </el-pagination>
            <p></p>
          </div>
        </el-scrollbar>
      </div>
    </el-drawer>
    <div class="border_sites">
      <el-row>
        <el-col :span="8">
          <div class="one">
            <div class="one-1">
              <div v-for="m in tableList" class="one-1-1" style="cursor:pointer">
                <div class="one-a" @click="look(m.name,m.finsValue)">
                  <div class="one-a-1">{{m.name}}月</div>
                  <div class="one-b-1">{{m.tranValue | numFilter}}</div>
                  <div class="one-a-2">
                    <span style="font-size:12px">目标：<b>{{m.value | number}}</b></span>
                  </div>
                  <div class="one-a-3">
                    <span style="font-size: 12px">合计完成：</span>
                    <b>{{m.finsValue}}</b>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="3" :push="8">
          <div class="first_border">
            <div class="one-1-3" @click="look(13,1)">
              <div v-for="n in firstList" style="cursor:pointer">
                <div class="one-a">
                  <div class="one-a-1">上半年</div>
                  <div class="one-b-1">{{n.tranValue | numFilter}}</div>
                  <div class="one-a-2">
                    <span style="font-size:12px">目标：<b>{{n.value | number}}</b></span>
                  </div>
                  <div class="one-a-3">
                    <span style="font-size: 12px">合计完成：</span>
                    <b>{{n.finsValue | number}}</b>
                  </div>
                </div>
              </div>
            </div>
            <div class="one-1-3" style="margin-top: 10px">
              <div v-for="s in secondList" style="cursor:pointer">
                <div class="one-a" @click="look(14,1)">
                  <div class="one-a-1">下半年</div>
                  <div class="one-b-1">{{s.tranValue | numFilter}}</div>
                  <div class="one-a-2">
                    <span style="font-size:12px">目标：<b>{{s.value | number}}</b></span>
                  </div>
                  <div class="one-a-3">
                    <span style="font-size: 12px">合计完成：</span>
                    <b>{{s.finsValue | number}}</b>
                  </div>
                </div>
              </div>
            </div>
            <div class="one-1-4" style="margin-top: 10px">
              <div v-for="t in thirdList" style="cursor:pointer">
                <div class="one-a" @click="look(15,1)">
                  <div class="one-a-1">全年</div>
                  <div class="one-b-1">{{t.tranValue | numFilter}}</div>
                  <div class="one-a-2">
                    <span style="font-size:12px">目标：<b>{{t.value | number}}</b></span>
                  </div>
                  <div class="one-a-3">
                    <span style="font-size: 12px">合计完成：</span>
                    <b>{{t.finsValue | number}}</b>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </el-col>
      </el-row>
    </div>
    <p>
      <b>销售目标说明：</b><br/>
      <b>在PC上查看目标的月度完成、季度、半年和全年的合计</b>
    </p>
  </div>
</template>

<script>
  export default {
    name: "AsmbManager",
    data() {
      return {
        tableList: [],    //全年列表
        firstList: [],    //上半年列表
        secondList: [],   //下半年列表
        thirdList: [],    //全年列表
        empList:[],       //员工列表
        tableData: [],
        monthList: [],    //员工已有目标的月份
        currPage: 1,     //当前页
        totalSize: 0,    //总条数
        pageSize: 5,     //页大小
        date: 2020,
        year: '',         //目标年
        years: '',        //当前年
        nowtime: 12,     //当前月
        time:'',         //查询日期
        empName:'',      //员工姓名
        total: 0.00,     //总数
        totalMonth: 12,  //总数月份
        employeesId: '', //部门员工集合
        empId: '',       //员工id
        monthMax: '',    //最大月份
        january: '',
        february: '',
        march: '',
        april: '',
        may: '',
        june: '',
        july: '',
        august: '',
        september: '',
        october: '',
        november: '',
        december: '',
        disabled: false,
        disabled2: false,
        disabled3: false,
        disabled4: false,
        disabled5: false,
        disabled6: false,
        disabled7: false,
        disabled8: false,
        disabled9: false,
        disabled10: false,
        disabled11: false,
        disabled12: false,
        disabledFn: true,
        dialogFormVisible: false,
        dialogFormVisibleTwo: false,
        options: [{
          value: '选项1',
          label: '2019'
        }, {
          value: '选项2',
          label: '2020'
        }, {
          value: '选项3',
          label: '2021'
        }, {
          value: '选项4',
          label: '2022'
        }, {
          value: '选项5',
          label: '2023'
        }],
        option: [{
          value: '选项1',
          label: '2020'
        }, {
          value: '选项2',
          label: '2021'
        }, {
          value: '选项3',
          label: '2022'
        }, {
          value: '选项4',
          label: '2023'
        }, {
          value: '选项5',
          label: '2024'
        }]
      }
    },
    created:function(){
      this.initData(this.date);

      this.$axios.get("http://localhost:8088/tar/dept-emp"
      ).then(v=>{
        this.empList = v.data;
      }).catch(v=>{
        window.console.log("访问失败!"+v.data);
      })
    },
    methods:{
      getNowTime() {//当前年月
        var now = new Date();
        var year = now.getFullYear();   //得到年份
        var month = now.getMonth();     //得到月份
        var date = now.getDate();       //得到日期
        month = month + 1;
        //month = month.toString().padStart(2, "0");
        date = date.toString().padStart(2, "0");
        //var defaultDate = `${year}年${month}月${date} 日`;
        this.nowtime = month;
        this.years = year;
      },
      initData(date){
        if(date != undefined && date != null && date != '') {
          this.$axios.get("http://localhost:8088/tar/list-info",
            {params: {date:this.date}}
          ).then(v => {
            this.tableList = v.data;
          }).catch(v => {
            alert("访问失败!" + v.data);
          })

          this.$axios.get("http://localhost:8088/tar/first-info",
            {params: {date:this.date}}
          ).then(v => {
            this.firstList = v.data;
          }).catch(v => {
            alert("访问失败!" + v.data);
          })

          this.$axios.get("http://localhost:8088/tar/second-info",
            {params: {date:this.date}}
          ).then(v => {
            this.secondList = v.data;
          }).catch(v => {
            alert("访问失败!" + v.data);
          })

          this.$axios.get("http://localhost:8088/tar/third-info",
            {params: {date:this.date}}
          ).then(v => {
            this.thirdList = v.data;
          }).catch(v => {
            alert("访问失败!" + v.data);
          })
        }
      },
      initDate(time, empName, currPage, pageSize){
        this.$axios.get("http://localhost:8088/tar/tare-date",
          {params:{time:time, empName:empName, currPage:currPage, pageSize:pageSize}}
        ).then(v=>{
          this.tableData = v.data.rows;
          this.totalSize = v.data.total;
        }).catch(v=>{
          window.console.log("访问失败!"+v.data);
        })
      },
      empDate(){
        this.disabled = false;
        this.disabled2 = false;
        this.disabled3 = false;
        this.disabled4 = false;
        this.disabled5 = false;
        this.disabled6 = false;
        this.disabled7 = false;
        this.disabled8 = false;
        this.disabled9 = false;
        this.disabled10 = false;
        this.disabled11 = false;
        this.disabled12 = false;
        this.$axios.get("http://localhost:8088/tar/emp-date",
          {params: {empId:this.empId, date:this.year}}
        ).then(v => {
          this.monthList = v.data;
          if(this.monthList != null) {
            for (var i = 0; i < this.monthList.length; i++) {
              if (this.monthList[i] == 1) {
                this.disabled = true;
                this.january = '';
              }
              if (this.monthList[i] == 2) {
                this.disabled2 = true;
              }
              if (this.monthList[i] == 3) {
                this.disabled3 = true;
              }
              if (this.monthList[i] == 4) {
                this.disabled4 = true;
              }
              if (this.monthList[i] == 5) {
                this.disabled5 = true;
              }
              if (this.monthList[i] == 6) {
                this.disabled6 = true;
              }
              if (this.monthList[i] == 7) {
                this.disabled7 = true;
              }
              if (this.monthList[i] == 8) {
                this.disabled8 = true;
              }
              if (this.monthList[i] == 9) {
                this.disabled9 = true;
              }
              if (this.monthList[i] == 10) {
                this.disabled10 = true;
              }
              if (this.monthList[i] == 11) {
                this.disabled11 = true;
              }
              if (this.monthList[i] == 12) {
                this.disabled12 = true;
              }
            }
          }
        }).catch(v => {
          alert("访问失败!" + v.data);
        })

        this.$axios.get("http://localhost:8088/tar/date-max",
          {params: {empId:this.empId, date:this.year}}
        ).then(v=>{
          this.monthMax = v.data;
        }).catch(v=>{
          alert("访问失败!" + v.data);
        })
      },
      empChange(item) {//获取员工id
        if (this.employeesId != '') {
          this.empId = item[1];
          this.disabledFn = false;
          this.january = '';
          this.february = '';
          this.march = '';
          this.april = '';
          this.may = '';
          this.june = '';
          this.july = '';
          this.august = '';
          this.september = '';
          this.october = '';
          this.november = '';
          this.december = '';
          this.empDate();
        } else {
          this.empId = 0;
        }
        this.disabledAvg();
      },
      disabledAvg(){
        if(this.year > this.years){
          this.totalMonth = 12;
          this.disabled = false;
          this.disabled2 = false;
          this.disabled3 = false;
          this.disabled4 = false;
          this.disabled5 = false;
          this.disabled6 = false;
          this.disabled7 = false;
          this.disabled8 = false;
          this.disabled9 = false;
          this.disabled10 = false;
          this.disabled11 = false;
          this.disabled12 = false;
        }
        if(this.year == this.years){
          var nowdate = this.nowtime;
          if(nowdate == 1){
            this.totalMonth = 12;
            this.disabled = false;
          }
          if(nowdate == 2){
            this.totalMonth = 11;
            this.disabled = true;
          }
          if(nowdate == 3){
            this.totalMonth = 10;
            this.disabled = true;
            this.disabled2 = true;
          }
          if(nowdate == 4){
            this.totalMonth = 9;
            this.disabled = true;
            this.disabled2 = true;
            this.disabled3 = true;
          }
          if(nowdate == 5){
            this.totalMonth = 8;
            this.disabled = true;
            this.disabled2 = true;
            this.disabled3 = true;
            this.disabled4 = true;
          }
          if(nowdate == 6){
            this.totalMonth = 7;
            this.disabled = true;
            this.disabled2 = true;
            this.disabled3 = true;
            this.disabled4 = true;
            this.disabled5 = true;
          }
          if(nowdate == 7){
            this.totalMonth = 6;
            this.disabled = true;
            this.disabled2 = true;
            this.disabled3 = true;
            this.disabled4 = true;
            this.disabled5 = true;
            this.disabled6 = true;
          }
          if(nowdate == 8){
            this.totalMonth = 5;
            this.disabled = true;
            this.disabled2 = true;
            this.disabled3 = true;
            this.disabled4 = true;
            this.disabled5 = true;
            this.disabled6 = true;
            this.disabled7 = true;
          }
          if(nowdate == 9){
            this.totalMonth = 4;
            this.disabled = true;
            this.disabled2 = true;
            this.disabled3 = true;
            this.disabled4 = true;
            this.disabled5 = true;
            this.disabled6 = true;
            this.disabled7 = true;
            this.disabled8 = true;
          }
          if(nowdate == 10){
            this.totalMonth = 3;
            this.disabled = true;
            this.disabled2 = true;
            this.disabled3 = true;
            this.disabled4 = true;
            this.disabled5 = true;
            this.disabled6 = true;
            this.disabled7 = true;
            this.disabled8 = true;
            this.disabled9 = true;
          }
          if(nowdate == 11){
            this.totalMonth = 2;
            this.disabled = true;
            this.disabled2 = true;
            this.disabled3 = true;
            this.disabled4 = true;
            this.disabled5 = true;
            this.disabled6 = true;
            this.disabled7 = true;
            this.disabled8 = true;
            this.disabled9 = true;
            this.disabled10 = true;
          }
          if(nowdate == 12){
            this.totalMonth = 1;
            this.disabled = true;
            this.disabled2 = true;
            this.disabled3 = true;
            this.disabled4 = true;
            this.disabled5 = true;
            this.disabled6 = true;
            this.disabled7 = true;
            this.disabled8 = true;
            this.disabled9 = true;
            this.disabled10 = true;
            this.disabled11 = true;
          }
        }
      },
      countAvg(){
        if(this.monthMax == ''){
          if(this.year > this.years){
            var avg = (this.total / 12).toFixed(2);
            this.january = avg;
            this.february = avg;
            this.march = avg;
            this.april = avg;
            this.may = avg;
            this.june = avg;
            this.july = avg;
            this.august = avg;
            this.september = avg;
            this.october = avg;
            this.november = avg;
            this.december = avg;
          }
          if(this.year == this.years) {
            var avg = (this.total / (12 - (this.nowtime - 1))).toFixed(2);
            if (this.nowtime == 11) {
              this.december = avg;
            }
            if (this.nowtime == 11) {
              this.november = avg;
              this.december = avg;
            }
            if (this.nowtime == 10) {
              this.october = avg;
              this.november = avg;
              this.december = avg;
            }
            if (this.nowtime == 9) {
              this.september = avg;
              this.october = avg;
              this.november = avg;
              this.december = avg;
            }
            if (this.nowtime == 8) {
              this.august = avg;
              this.september = avg;
              this.october = avg;
              this.november = avg;
              this.december = avg;
            }
            if (this.nowtime == 7) {
              this.july = avg;
              this.august = avg;
              this.september = avg;
              this.october = avg;
              this.november = avg;
              this.december = avg;
            }
            if (this.nowtime == 6) {
              this.june = avg;
              this.july = avg;
              this.august = avg;
              this.september = avg;
              this.october = avg;
              this.november = avg;
              this.december = avg;
            }
            if (this.nowtime == 5) {
              this.may = avg;
              this.june = avg;
              this.july = avg;
              this.august = avg;
              this.september = avg;
              this.october = avg;
              this.november = avg;
              this.december = avg;
            }
            if (this.nowtime == 4) {
              this.april = avg;
              this.may = avg;
              this.june = avg;
              this.july = avg;
              this.august = avg;
              this.september = avg;
              this.october = avg;
              this.november = avg;
              this.december = avg;
            }
            if (this.nowtime == 3) {
              this.march = avg;
              this.april = avg;
              this.may = avg;
              this.june = avg;
              this.july = avg;
              this.august = avg;
              this.september = avg;
              this.october = avg;
              this.november = avg;
              this.december = avg;
            }
            if (this.nowtime == 2) {
              this.february = avg;
              this.march = avg;
              this.april = avg;
              this.may = avg;
              this.june = avg;
              this.july = avg;
              this.august = avg;
              this.september = avg;
              this.october = avg;
              this.november = avg;
              this.december = avg;
            }
            if (this.nowtime == 1) {
              this.january = avg;
              this.february = avg;
              this.march = avg;
              this.april = avg;
              this.may = avg;
              this.june = avg;
              this.july = avg;
              this.august = avg;
              this.september = avg;
              this.october = avg;
              this.november = avg;
              this.december = avg;
            }
          }
        }
        if(this.monthMax < 12) {
          var avg = (this.total / (12 - this.monthMax)).toFixed(2);
          if (this.monthMax == 11) {
            this.december = avg;
          }
          if (this.monthMax == 10) {
            this.november = avg;
            this.december = avg;
          }
          if (this.monthMax == 9) {
            this.october = avg;
            this.november = avg;
            this.december = avg;
          }
          if (this.monthMax == 8) {
            this.september = avg;
            this.october = avg;
            this.november = avg;
            this.december = avg;
          }
          if (this.monthMax == 7) {
            this.august = avg;
            this.september = avg;
            this.october = avg;
            this.november = avg;
            this.december = avg;
          }
          if (this.monthMax == 6) {
            this.july = avg;
            this.august = avg;
            this.september = avg;
            this.october = avg;
            this.november = avg;
            this.december = avg;
          }
          if (this.monthMax == 5) {
            this.june = avg;
            this.july = avg;
            this.august = avg;
            this.september = avg;
            this.october = avg;
            this.november = avg;
            this.december = avg;
          }
          if (this.monthMax == 4) {
            this.may = avg;
            this.june = avg;
            this.july = avg;
            this.august = avg;
            this.september = avg;
            this.october = avg;
            this.november = avg;
            this.december = avg;
          }
          if (this.monthMax == 3) {
            this.april = avg;
            this.may = avg;
            this.june = avg;
            this.july = avg;
            this.august = avg;
            this.september = avg;
            this.october = avg;
            this.november = avg;
            this.december = avg;
          }
          if (this.monthMax == 2) {
            this.march = avg;
            this.april = avg;
            this.may = avg;
            this.june = avg;
            this.july = avg;
            this.august = avg;
            this.september = avg;
            this.october = avg;
            this.november = avg;
            this.december = avg;
          }
          if (this.monthMax == 1) {
            this.february = avg;
            this.march = avg;
            this.april = avg;
            this.may = avg;
            this.june = avg;
            this.july = avg;
            this.august = avg;
            this.september = avg;
            this.october = avg;
            this.november = avg;
            this.december = avg;
          }
        }
        if(this.monthMax == 12){
          this.disabledFn = true;
        }
      },
      dateAim(){
        this.dialogFormVisible = true;
        this.year = '';
        this.disabledFn  = true;
        this.clear();
        this.getNowTime();
      },
      dateAir(){
        this.dialogFormVisibleTwo = true;
        this.time = '';
        this.empName = '';
        this.initDate(this.time, this.empName, this.currPage, this.pageSize);
      },
      changeDate(){
        this.initData(this.date);
      },
      changeYear(){
        this.clear();
        this.disabledAvg();
      },
      changePage(currPage){
        this.initDate(this.time, this.empName,currPage, this.pageSize);
      },
      sizeChange (pageSize) { //改变页大小
        this.initDate(this.time, this.empName,1, pageSize);
        this.pageSize = pageSize;
      },
      changeTime(){
        this.initDate(this.time, this.empName, this.currPage, this.pageSize);
      },
      searchPage(){
        this.initDate(this.time, this.empName, this.currPage, this.pageSize);
      },
      changeSum(){
        let sum;
        if(this.monthMax == ''){
          if(this.year > this.years){
            sum = parseFloat(this.january)
              +parseFloat(this.february)
              +parseFloat(this.march)
              +parseFloat(this.april)
              +parseFloat(this.may)
              +parseFloat(this.june)
              +parseFloat(this.july)
              +parseFloat(this.august)
              +parseFloat(this.september)
              +parseFloat(this.october)
              +parseFloat(this.november)
              +parseFloat(this.december);
          }
          if(this.year == this.years){
            if(this.nowtime == 11){
              sum = parseFloat(this.november)
                +parseFloat(this.december);
            }
            if(this.nowtime == 10){
              sum = parseFloat(this.october)
                +parseFloat(this.november)
                +parseFloat(this.december);
            }
            if(this.nowtime == 9){
              sum = parseFloat(this.september)
                +parseFloat(this.october)
                +parseFloat(this.november)
                +parseFloat(this.december);
            }
            if(this.nowtime == 8){
              sum = parseFloat(this.august)
                +parseFloat(this.september)
                +parseFloat(this.october)
                +parseFloat(this.november)
                +parseFloat(this.december);
            }
            if(this.nowtime == 7){
              sum = parseFloat(this.july)
                +parseFloat(this.august)
                +parseFloat(this.september)
                +parseFloat(this.october)
                +parseFloat(this.november)
                +parseFloat(this.december);
            }
            if(this.nowtime == 6){
              sum = parseFloat(this.june)
                +parseFloat(this.july)
                +parseFloat(this.august)
                +parseFloat(this.september)
                +parseFloat(this.october)
                +parseFloat(this.november)
                +parseFloat(this.december);
            }
            if(this.nowtime == 5){
              sum = parseFloat(this.may)
                +parseFloat(this.june)
                +parseFloat(this.july)
                +parseFloat(this.august)
                +parseFloat(this.september)
                +parseFloat(this.october)
                +parseFloat(this.november)
                +parseFloat(this.december);
            }
            if(this.nowtime == 4){
              sum = parseFloat(this.april)
                +parseFloat(this.may)
                +parseFloat(this.june)
                +parseFloat(this.july)
                +parseFloat(this.august)
                +parseFloat(this.september)
                +parseFloat(this.october)
                +parseFloat(this.november)
                +parseFloat(this.december);
            }
            if(this.nowtime == 3){
              sum = parseFloat(this.march)
                +parseFloat(this.april)
                +parseFloat(this.may)
                +parseFloat(this.june)
                +parseFloat(this.july)
                +parseFloat(this.august)
                +parseFloat(this.september)
                +parseFloat(this.october)
                +parseFloat(this.november)
                +parseFloat(this.december);
            }
            if(this.nowtime == 2){
              sum = parseFloat(this.february)
                +parseFloat(this.march)
                +parseFloat(this.april)
                +parseFloat(this.may)
                +parseFloat(this.june)
                +parseFloat(this.july)
                +parseFloat(this.august)
                +parseFloat(this.september)
                +parseFloat(this.october)
                +parseFloat(this.november)
                +parseFloat(this.december);
            }
            if(this.nowtime == 1){
              sum = parseFloat(this.january)
                +parseFloat(this.february)
                +parseFloat(this.march)
                +parseFloat(this.april)
                +parseFloat(this.may)
                +parseFloat(this.june)
                +parseFloat(this.july)
                +parseFloat(this.august)
                +parseFloat(this.september)
                +parseFloat(this.october)
                +parseFloat(this.november)
                +parseFloat(this.december);
            }
          }
        }
        if(this.monthMax == 11){
          sum = parseFloat(this.december);
        }
        if(this.monthMax == 10){
          sum = parseFloat(this.november)
            +parseFloat(this.december);
        }
        if(this.monthMax == 9){
          sum = parseFloat(this.october)
            +parseFloat(this.november)
            +parseFloat(this.december);
        }
        if(this.monthMax == 8){
          sum = parseFloat(this.september)
            +parseFloat(this.october)
            +parseFloat(this.november)
            +parseFloat(this.december);
        }
        if(this.monthMax == 7){
          sum = parseFloat(this.august)
            +parseFloat(this.september)
            +parseFloat(this.october)
            +parseFloat(this.november)
            +parseFloat(this.december);
        }
        if(this.monthMax == 6){
          sum = parseFloat(this.july)
            +parseFloat(this.august)
            +parseFloat(this.september)
            +parseFloat(this.october)
            +parseFloat(this.november)
            +parseFloat(this.december);
        }
        if(this.monthMax == 5){
          sum = parseFloat(this.june)
            +parseFloat(this.july)
            +parseFloat(this.august)
            +parseFloat(this.september)
            +parseFloat(this.october)
            +parseFloat(this.november)
            +parseFloat(this.december);
        }
        if(this.monthMax == 4){
          sum = parseFloat(this.may)
            +parseFloat(this.june)
            +parseFloat(this.july)
            +parseFloat(this.august)
            +parseFloat(this.september)
            +parseFloat(this.october)
            +parseFloat(this.november)
            +parseFloat(this.december);
        }
        if(this.monthMax == 3){
          sum = parseFloat(this.april)
            +parseFloat(this.may)
            +parseFloat(this.june)
            +parseFloat(this.july)
            +parseFloat(this.august)
            +parseFloat(this.september)
            +parseFloat(this.october)
            +parseFloat(this.november)
            +parseFloat(this.december);
        }
        if(this.monthMax == 2){
          sum = parseFloat(this.march)
            +parseFloat(this.april)
            +parseFloat(this.may)
            +parseFloat(this.june)
            +parseFloat(this.july)
            +parseFloat(this.august)
            +parseFloat(this.september)
            +parseFloat(this.october)
            +parseFloat(this.november)
            +parseFloat(this.december);
        }
        if(this.monthMax == 1){
          sum = parseFloat(this.february)
            +parseFloat(this.march)
            +parseFloat(this.april)
            +parseFloat(this.may)
            +parseFloat(this.june)
            +parseFloat(this.july)
            +parseFloat(this.august)
            +parseFloat(this.september)
            +parseFloat(this.october)
            +parseFloat(this.november)
            +parseFloat(this.december);
        }
        this.total = sum.toFixed(2);
      },
      addTarget(){
        if(this.employeesId != '') {
          this.$axios.post("http://localhost:8088/tar/save-target", {
            employeesId: this.employeesId,
            year: this.year,
            january: this.january,
            february: this.february,
            march: this.march,
            april: this.april,
            may: this.may,
            june: this.june,
            july: this.july,
            august: this.august,
            september: this.september,
            october: this.october,
            november: this.november,
            december: this.december
          }).then(() => {
            this.$message.success("新增成功");
            this.dialogFormVisible = false;
          }).catch(v => {
            alert("访问失败!" + v.data);
          })
        }else{
          this.$message.error("必须至少选择一名员工");
        }
      },
      update(goalId,goalValue){
        this.$confirm('此操作将永久修改该数据, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$axios.get("http://localhost:8088/tar/update-tare",
            {params: {goalId:goalId, goalValue:goalValue}}
          ).then(() => {
            this.$message({
              type: 'success',
              message: '修改成功!'
            })
            //刷新数据
            this.initDate(this.time, this.empName, this.currPage, this.pageSize);
          }).catch(v => {
            alert("访问失败!" + v.data);
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消修改'
          })
        })
      },
      look(month,finsValue){
        if(finsValue != 0) {
          this.$router.push({
            path: '/tails',
            query: {
              date: this.date,
              months: month
            }
          })
        }else{
          this.$message({
            showClose: true,
            message: '暂无详细数据',
            type: 'warning'
          })
        }
      },
      clear(){
        this.total = '';
        this.employeesId = '';
        this.january = '';
        this.february = '';
        this.march = '';
        this.april = '';
        this.may = '';
        this.june = '';
        this.july = '';
        this.august = '';
        this.september = '';
        this.october = '';
        this.november = '';
        this.december = '';
        this.disabled = false;
        this.disabled2 = false;
        this.disabled3 = false;
        this.disabled4 = false;
        this.disabled5 = false;
        this.disabled6 = false;
        this.disabled7 = false;
        this.disabled8 = false;
        this.disabled9 = false;
        this.disabled10 = false;
        this.disabled11 = false;
        this.disabled12 = false;
      }
    },
    filters: {
      numFilter (value) {
        let realVal = '';
        if (!isNaN(value) && value !== '') {
          if(value === 0){
            return value+'%';
          }else{
            // 截取当前数据到小数点后两位
            realVal = parseFloat(value).toFixed(2);
            var str = Number(realVal*100).toFixed();
            str+="%";
            return str;
          }
        }
      },
      number(value) {
        if (!value) return 0;
        var intPart = Number(value).toFixed(0); // 获取整数部分
        var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') // 将整数部分逢三一断
        return intPartFormat
      },
      numSum(value) {
        if (!value) return ' ';
        var intPart = Number(value).toFixed(0); // 获取整数部分
        if(intPart.length <= 4){
          if(intPart.length <= 3){
            return "0.0"+intPart;
          }
          if(intPart.length <= 2){
            return "0.00"+intPart;
          }
          if(intPart.length <= 1){
            return "0.000"+intPart;
          }
          return "0."+intPart;
        }
        var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{4})+$)/g, '$1.'); // 将整数部分逢三一断
        return intPartFormat
      },
      formatDate(time){
        let date   = new Date(time);//把定义的时间赋值进来进行下面的转换
        let year   = date.getFullYear();
        let month  = date.getMonth()+1;
        let day    = date.getDate();
        let hour   = date.getHours();
        let minute = date.getMinutes();
        let second = date.getSeconds();
        return year+"-"+month;
        /*return year+"-"+month+"-"+day+" "+hour+":"+minute+":"+second;*/
      }
    }
  }
</script>

<style scoped>
  h4{
    color: #505458;
    font-family: "microsoft yahei","Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin: -6.5px 0;
  }
  b{
    font-weight: 600;
  }
  .one{
    border: 1px solid white;
    width: 530px;
    height: 600px;
    margin-top: 5px;
  }
  .one-1{
    float: left;
    height: 160px;
    width: 100%;
  }
  .one-1-1{
    float: left;
    height: 130px;
    width: 150px;
    margin-right: 20px;
    border: 1px solid rgba(54, 64, 74, 0.05);
    background-color: #F4F8FB;
    border-radius: 5px;
    margin-top: 10px;
  }
  .one-a{
    width: 113px;
    height: 69px;
    font-size: 12px;
    margin:20px 0px 0px 20px;
    margin-top: 30px;
  }
  .one-a-1{
    height: 20px;
    margin-top: -10px;
    color: #000000;
  }
  .one-a-2{
    height: 20px;
    font-size: 16px;
    margin-left:15px;
    margin-top:15px;
    color: #000000;
  }
  .one-a-3{
    margin-left:10px;
    margin-top: 15px;
    color: #000000;
  }
  p {
    font-size: 14px;
    line-height: 1.6;
    margin: 0 0 10px;
  }
  .one-1-3{
    float: left;
    height: 130px;
    width: 150px;
    margin-right: 20px;
    border: 1px solid rgba(54, 64, 74, 0.05);
    background: #dceffe;
    border-radius: 5px;
  }
  .one-1-4{
    float: left;
    height: 130px;
    width: 150px;
    margin-right: 20px;
    margin-top: 10px;
    border: 1px solid #FBE6E6;
    background: #FBE6E6;
    border-radius: 5px;
  }
  .one-b-1{
    float: left;
    margin-left: 85px;
    margin-top: -18px;
    color: #000000;
  }
  .border-t-a {
    border-top: 1px solid #aaaaaa;
    margin-top: -20px;
    margin-bottom: 30px;
  }
  .first_quarter{
    border: 1px solid #D8D8D8;
    width: 208px;
    height: 200px;
    background-color: #F9F9F9;
  }
  .border-t-b {
    border-top: 0.5px solid #D8D8D8;
    margin-bottom: 20px;
  }
  .count_money{
    border: 1px solid #D8D8D8;
    width: 890px;
    height: 60px;
    margin-bottom: 10px;
    background-color: #F9F9F9;
  }
  .border_site{
    border: 1px solid #F9F9F9;
    width: 560px;
    height: 30px;
    margin-left: 260px;
    margin-top: 10px;
    font-size: 16px;
  }
  .limit{
    margin-top:10px;
    margin-left:30px;
  }
  .first_border{
    border: 1px solid white;
    width: 160px;
    height: 450px;
    margin-top: 15px;
    float: left;
  }
  .border_sites{
    border: 1px solid white;
    width: 800px;
    height: 620px;
  }
  .div_width{
    width: 99%;
    height: 800px;
    background-color: white;
    padding-left: 20px;
  }
</style>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             
